<template>
  <div class="tab-content machine-detail">
    <BasicCard>
      <BasicVxeTable ref="gridRef" v-bind="gridOptions"></BasicVxeTable>
    </BasicCard>
    <BasicCard style="margin-top: 12px">
      <BasicVxeTable ref="gridRefClass" v-bind="gridOptionsClass"></BasicVxeTable>
    </BasicCard>
  </div>
</template>
<script setup lang="ts">
  // import { CategoryStatisticsRowVO } from '../types'
  import dayjs from 'dayjs'
  import { handleColumnsList, categoryStatisticsColumns } from '../data'
  import {
    getShiShiZhuangTaiQuanJi,
    postJiTaiXiangQinList,
    getwuLiaoAndJiTai
  } from '@/api/shengChanJianShi'

  const props = defineProps({
    processName: String,
    statusCode: String
  })

  const { t } = useI18n()
  const gridRef = ref<BasicGridInstance>()
  const machineryOptionsData = ref<any>([])
  // const filterProcessList = ref([])
  const machineryIdArr = ref<any>([])
  const machineryNameArr = ref<any>([])
  const detailData = ref<any>([])

  const gridOptions = reactive<BasicGridProps>({
    extraConfig: {
      title: t('custom.单机详情'),
      isCustom: true,
      isExport: true,
      isFilterAndSort: true
    }, // 拓展的配置
    id: `machine-detail-${props.statusCode}`, // id用于缓存,务必配置
    toolbarConfig: {}, // 工具栏
    maxHeight: 500,
    exportConfig: {
      filename: '数据表'
    },
    proxyConfig: {
      autoLoad: false,
      // showLoading: false, // 关闭加载中
      ajax: {
        query: () => {
          // 默认接收 Promise<any[]>
          return findList()
        }
      }
    }
  })

  // 分类统计
  const gridOptionsClass = reactive<BasicGridProps>({
    extraConfig: {
      title: t('custom.分类统计'),
      isCustom: true,
      isExport: true,
      isFilterAndSort: true
    }, // 拓展的配置
    id: `machine-detail-${props.statusCode}-classify`, // id用于缓存,务必配置
    toolbarConfig: {}, // 工具栏
    exportConfig: {
      filename: '数据表'
    },
    maxHeight: 500,
    columns: categoryStatisticsColumns
  })

  // 大写转换
  const upperJSONKey = (jsonObj) => {
    for (let key in jsonObj) {
      jsonObj[key.toUpperCase()] = jsonObj[key]
    }
    return jsonObj
  }

  // 获取表格columns数据
  const getTableColumnsData = () => {
    getShiShiZhuangTaiQuanJi(props.processName).then((res) => {
      gridOptions.columns = handleColumnsList(res)
    })
  }

  // 获取物料和机台列表
  const getMaterialsAndMachineryList = () => {
    getwuLiaoAndJiTai(props.processName).then((res: any) => {
      const backupJson: any = [...res]

      for (let i = 0; i < backupJson.length; i++) {
        const item = backupJson[i]
        item.text = item.text || '未设置品种'
        item.id = item.id || `10000${i}`
        for (let j = 0; j < item.childNodes.length; j++) {
          const node = item.childNodes[j]
          if (node.check) {
            machineryIdArr.value.push(node.id)
            machineryNameArr.value.push(node.text)
          }
        }
      }

      machineryOptionsData.value = backupJson
      getTableColumnsData()
      // 调取grid的query方法
      gridRef.value?.$grid?.commitProxy('query')
    })
  }

  // 获取表格数据
  const findList = () => {
    return new Promise<any[]>((resolve) => {
      postJiTaiXiangQinList(machineryIdArr.value, props.processName).then((res: any) => {
        gridOptionsClass.data = res.group.map((val) => {
          return {
            variety: val.品种,
            openedNumber: val.开台数,
            accumulatedLength: val.本月累计长度 === null ? '' : parseInt(val.本月累计长度),
            ingotSpeed: val.锭速 | parseInt(val.锭速)
          }
        })
        for (let i = 0; i < res.details.length; i++) {
          const value = res.details[i]
          let realtime = {}
          if (value.machineRealInfo !== null) {
            if (value.basic.manufacturerName == '村田株式会社') {
              realtime = {
                ...value.machineRealInfo.realtime,
                ...value.machineRealInfo.realtime.machine
              }
              realtime = upperJSONKey(realtime)
            } else {
              realtime = upperJSONKey(value.machineRealInfo.realtime)
            }
            let settings = upperJSONKey(value.machineRealInfo.settings)
            let process = upperJSONKey(value.machineRealInfo.process)
            let values = {
              machineName: value.basic.machineName,
              materialName: value.basic.materialName,
              stateCode: value.basic.stateCode,
              lastModificationTime:
                value.basic.lastModificationTime == null
                  ? null
                  : dayjs(value.basic.lastModificationTime).format('MM-DD HH:mm'),

              gongXu: props.processName,
              ...realtime,
              ...process,
              ...settings
            }
            detailData.value.push(values)
          } else {
            let values = {
              machineName: value.basic.machineName,
              materialName: value.basic.materialName,
              stateCode: value.basic.stateCode,
              gongXu: props.processName
            }
            detailData.value.push(values)
          }
        }
        resolve(detailData.value)
      })
    })
  }

  onMounted(() => {
    getMaterialsAndMachineryList()
  })
</script>

<style scoped lang="scss"></style>
